<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>常用模态框</title>
		<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
		<style>
			.modal-dialog{
				position: fixed;
				top: 50%;
				left: 50%;
				transform: translate(-50%,-50%) !important;
			}
			table{
				border: none;
				width:100%;
				text-align:center;/*文本居中*/
				border-collapse:collapse; /*表格的边框合并，如果相邻，则共用一个边框*/
				border-spacing:0; /*设置行与单元格边框的间距。当表格边框独立（即border-collapse:separate;）此属性才起作用*/
			}
			tr,td{
				border: none;
			}
			.form-control:nth-of-type(odd){
				margin: 10px 0;
			}
		</style>
	</head>
	<body>
		<h2>创建模态框（Modal）</h2>
		<!-- 按钮触发模态框 -->
		<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">开始演示模态框</button>
		<!-- 模态框（Modal） -->
		<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
						<h4 class="modal-title" id="myModalLabel">模态框（Modal）标题</h4>
					</div>
					<div class="modal-body">
						<table border="" cellspacing="" cellpadding="">
							<tr>
								<td>价格名称：<b>*</b></td>
								<td>
									<input type="text" class="form-control" />
								</td>
							</tr>
							<tr>
								<td>价格名称22：<b>*</b></td>
								<td>
									<input type="text" class="form-control" />
								</td>
							</tr>
							<tr>
								<td>价格名称33：<b>*</b></td>
								<td>
									<input type="text" class="form-control" />
								</td>
							</tr>
						</table>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
						<button type="button" class="btn btn-primary">提交更改</button>
					</div>
				</div><!-- /.modal-content -->
			</div><!-- /.modal -->
		</div>
		<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
		<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
	</body>
</html>
